<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="apple-mobile-web-app-capable" content="yes">
<title>抽奖活动</title>

<link rel="stylesheet" type="text/css" href="/prizeactv/public/app/b2c/statics/prizeactv/css/styleCJ.css"/>

</head>
<body class="lottery" id="lotteryBox">


<div class="shanDeng" id="deng">
	<div id="luck"><!-- luck -->
		<table>
			<tr>
				<td class="luck-unit luck-unit-0"><img src="/prizeactv/public/app/b2c/statics/prizeactv/img/1.png"></td>
				<td class="luck-unit luck-unit-1"><img src="/prizeactv/public/app/b2c/statics/prizeactv/img/2.png"></td>
				<td class="luck-unit luck-unit-2"><img src="/prizeactv/public/app/b2c/statics/prizeactv/img/3.png"></td>
				<td class="luck-unit luck-unit-3"><img src="/prizeactv/public/app/b2c/statics/prizeactv/img/4.png"></td>
			</tr>
			<tr>
				<td class="luck-unit luck-unit-11"><img src="/prizeactv/public/app/b2c/statics/prizeactv/img/5.png"></td>
				<td rowspan="2" colspan="2" class="cjBtn" id="btn"></td>
				<td class="luck-unit luck-unit-4"><img src="/prizeactv/public/app/b2c/statics/prizeactv/img/2.png"></td>
			</tr>
			<tr>
				<td class="luck-unit luck-unit-10"><img src="/prizeactv/public/app/b2c/statics/prizeactv/img/1.png"></td>
				<td class="luck-unit luck-unit-5"><img src="/prizeactv/public/app/b2c/statics/prizeactv/img/5.png"></td>
			</tr>
			<tr>
				<td class="luck-unit luck-unit-9"><img src="/prizeactv/public/app/b2c/statics/prizeactv/img/4.png"></td>
				<td class="luck-unit luck-unit-8"><img src="/prizeactv/public/app/b2c/statics/prizeactv/img/5.png"></td>
				<td class="luck-unit luck-unit-7"><img src="/prizeactv/public/app/b2c/statics/prizeactv/img/3.png"></td>
				<td class="luck-unit luck-unit-6"><img src="/prizeactv/public/app/b2c/statics/prizeactv/img/1.png"></td>
			</tr>
		</table>
	</div><!-- luckEnd -->
	<a href="/prizeactv/index.php/prizeactv-dList.html">
	<div style="padding-top: 150px;padding-left: 80%;line-height: 30px;color: red;font-size: 1.4em;">
	 查看开奖结果
	</div></a>
</div>

<script src="/prizeactv/public/app/b2c/statics/prizeactv/js/jquery-1.8.3.min.js"></script>
<script>
	var _page = {};
	var luck={
		index:-1,	//当前转动到哪个位置，起点位置
		count:0,	//总共有多少个位置
		timer:0,	//setTimeout的ID，用clearTimeout清除
		speed:20,	//初始转动速度
		times:0,	//转动次数
		cycle:50,	//转动基本次数：即至少需要转动多少次再进入抽奖环节
		prize:-1,	//中奖位置
		init:function(id){  //这里是初始化获取目标的
			if ($("#"+id).find(".luck-unit").length>0) {
				$luck = $("#"+id);
				$units = $luck.find(".luck-unit");
				this.obj = $luck;
				this.count = $units.length;
				$luck.find(".luck-unit-"+this.index).addClass("active");
			};
		},

		
		roll:function(){  //运行时
			var index = this.index;
			var count = this.count;
			var luck = this.obj;
			$(luck).find(".luck-unit-"+index).removeClass("active");
			index += 1;
			if (index>count-1) {
				index = 0;
			};
			$(luck).find(".luck-unit-"+index).addClass("active");
			this.index=index;
			return false;
		},
		stop:function(index){
			this.prize=index;
			console.log("prize="+index);
			if (_page.list[this.prize]) {
				if (_page.list[this.prize].prize_name==0) {
					alert("请继续努力哟！");
				} else {
					alert("恭喜中奖，奖品是"+_page.list[this.prize].prize_name);
				}

				instData(index);
			}

			return false;
		}
	};


	function roll(){
		luck.times += 1;
		luck.roll();
		if (luck.times > luck.cycle+10 && luck.prize==luck.index) {
			clearTimeout(luck.timer);
			luck.prize=-1;
			luck.times=0;
			click=false;
			luck.stop(luck.index);
		}else{
			if (luck.times<luck.cycle) {
				luck.speed -= 10;
			}else if(luck.times==luck.cycle) {
				var index = Math.random()*(luck.count)|0;
				luck.prize = index;		
			}else{
				if (luck.times > luck.cycle+10 && ((luck.prize==0 && luck.index==7) || luck.prize==luck.index+1)) {
					luck.speed += 110;
				}else{
					luck.speed += 20;
				}
			}
			if (luck.speed<40) {
				luck.speed=40;
			};

			luck.timer = setTimeout(roll,luck.speed);
		}
		return false;
	}


//闪灯效果
	var num = 0;
	$(".shanDeng").attr("class",function(){
		setInterval(function(){ 
			num++;
			if(num%2==0){
				$('#deng').addClass("shanDeng2");
			}else{
				$('#deng').addClass("shanDeng");
				$('#deng').removeClass('shanDeng2');
			}
		},500)
	})


	var click=false;
	window.onload=function(){
		luck.init('luck');
		$("#btn").click(function(){
			//按下弹起效果
			$("#btn").addClass("cjBtnDom");
			setTimeout(function(){	
				$("#btn").removeClass("cjBtnDom");
			},200);

			
			if(click) {
				return false;
			}
			else{
				luck.speed=100;
				roll();
				click=true;
				return false;
			}
		
		});
		var h=window.innerHeight|| document.documentElement.clientHeight|| document.body.clientHeight;
	    var h2=document.body.offsetHeight;
	    var body=document.getElementById('lotteryBox');
	    if(h>h2){
	    	body.style.height=(h-290)+"px";
	    }
	    else{
	    	body.style.height=h2+"px";
	    }
	};

	$(function(){
		_page.list  = eval('<{json from=$jsonListData}>') ;


	})

	function instData(_index2) {
		_url = "<{link app=b2c ctl=site_prizeactv  act=instData }>";

		_getCookie = getCookie('CookieID');
		if (_getCookie == null) {
			setCookie('CookieID',new Date().getTime() );
		}

		$.post(_url+'?prize_id='+((_index2-0)+1));

	}

	function getCookie(name)
	{
		var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");
		if(arr=document.cookie.match(reg))
			return unescape(arr[2]);
		else
			return null;
	}

	//写cookies
	function setCookie(name,value)
	{
		var Days = 30;
		var exp = new Date();
		exp.setTime(exp.getTime() + Days*24*60*60*1000);
		document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
	}

</script>

</body>
</html>